<div class="autoresponder-container">
<section class="pm_form" ng-if="!mock">
    <p class="alert alert-info" translate-context="Info" translate>Automatic replies can respond automatically to incoming messages (such as when you are on vacation and can't respond).</p>
</section>
<form name="autoresponderForm" novalidate>
    <div class="pm_grid no-padding no-margin">
        <autoresponder-time-section
            data-mock="{{ ::mock }}"
            data-form="autoresponderForm"></autoresponder-time-section>
        <section class="pm_form col-1-2" ng-if="model.IsEnabled">
            <div class="clearfix">
                <div class="col-1-4">
                    <label for="autoresponder-message" translate-context="Label" translate>Response</label>
                </div>
                <div class="col-3-4">
                    <autoresponder-message data-message="model.Message" data-disabled="{{ ::mock }}"></autoresponder-message>
                </div>
            </div>
        </section>
    </div>

    <div class="pm_grid no-padding no-margin">
        <div class="col-1-8 desktopOnly">&nbsp;</div>
        <div class="col-7-8">
            <button class="pm_button primary" id="autoresponder-save" ng-if="model.IsEnabled" translate-context="Action autoresponder" translate ng-disabled="!isValid() || mock || submitting" type="submit">Save</button>
            <a href="https://protonmail.com/support/knowledge-base/autoresponder/" target="_blank" class="pm_button link" translate-context="Link" translate>Learn more</a>
        </div>
    </div>
</form>
</div>
